<div class="jumbotron simple">
    <div class="container">
        <h1>Tài khoản <small>Quản lý số điện thoại</small></h1>
    </div>
</div>
<div id="container-main" class="container">
    <div class="row">
        <div class="col-md-18 col-sm-14">

            <div class="row">
                <div class="col-md-12">
                    <div class="page-header">
                        <h3>
                            <i class="fa fa-phone"></i> Danh sách SĐT
                            <span class="page-header-under success"></span>
                        </h3>
                    </div>

                    <div id="phone_list">
                        <?php $this->renderPartial('manage_phone_list', array('userPhones' => $this->user->userPhones))?>
                    </div>
                </div>

                <div class="col-md-12">
                    <div class="page-header">
                        <h3>
                            <i class="fa fa-plus-circle"></i> Thêm SĐT
                            <span class="page-header-under primary"></span>
                        </h3>
                    </div>

                    <?php $form=$this->beginWidget('CActiveForm', array(
                            'id'=>'add-phone-form',
                            'enableClientValidation'=>true,
                            'clientOptions'=>array(
                                'validateOnSubmit' => true,
                                'validateOnChange' => true,
                            ),
                            'enableAjaxValidation'=>true,
                            'htmlOptions' => array('class' => 'form-horizontal')
                        )); ?>

                    <div class="input-group">
                        <?php echo $form->textField($phoneModel,'phone',array('placeholder'=> $phoneModel->getAttributeLabel('phone'), 'maxlength'=>255, 'class' => 'form-control')); ?>
                        <span class="input-group-btn">
                            <button class="btn btn-primary" type="submit"><i class="fa fa-plus"></i> Thêm</button>
                        </span>
                    </div>

                    <?php echo $form->error($phoneModel,'phone');?>
                </div> 

                <?php $this->endWidget(); ?>
            </div>

            <hr class="visible-xs"/>
        </div>


        <div class="col-md-6 col-sm-10">
            <?php $this->renderPartial('_menu');?>
        </div>
    </div>
</div>

<script>
    $('input[name="is_main"]').live('change', function(){
        var phone = $(this).attr('phone_value');
        $.post('<?php echo $this->createUrl('/user/page/ajaxUpdatePhoneList')?>', {
            action: 'update_main', 
            phone_id: $(this).val()
            }, function(data){
                $('#phone_list').html(data);    
                myGrowl('Cập nhật thành công '+phone+' là SĐT chính!', 'success');    
            }
        );    
    }); 

    $('.phone_remove').live('click', function(e){
        e.preventDefault();
        var phone = $(this).attr('phone');
        var phone_id = $(this).attr('phone_id');

        bootbox.confirm({
            message: 'Bạn có chắc chắn muốn loại bỏ SĐT '+ phone + ' ?',
            buttons: {
                confirm: {
                    label: "<i class='fa fa-trash-o'></i> Chắc chắn xóa",
                    className: "btn-danger",
                },
                cancel: {
                    label: "Không xóa",
                    className: "btn-default",
                }
            },
            callback: function(result){
                if(result){
                    $.post('<?php echo $this->createUrl('/user/page/ajaxUpdatePhoneList')?>', {
                        action: 'remove', 
                        phone_id: phone_id
                        }, function(data){
                            $('#phone_list').html(data); 
                            myGrowl('Loại bỏ SĐT '+phone+' thành công!', 'info');    
                    });   
                }
            }
        });  

    });                                                                                                                                                 
</script>




 